<template>
    <Modal v-model="showModel" title="个人信息" width="800">
        <Form ref="addForm" :model="formData" label-position="top">
            <Row :gutter="16">
                <Col span="12">
                    <FormItem prop="name" label="姓名:（如果更改，通行码变成待审核）">
                        <div class="form-element">
                            <Input type="text" v-model="formData.name"/>
                        </div>
                    </FormItem>
                </Col>
                <!--                <Col span="12">-->
                <!--                    <FormItem prop="nickname" label="微信昵称:">-->
                <!--                        <div class="form-element">-->
                <!--                            <Input type="text" v-model="formData.nickname"/>-->
                <!--                        </div>-->
                <!--                    </FormItem>-->
                <!--                </Col>-->
                <Col span="12">
                    <FormItem prop="tel" label="手机号码:">
                        <div class="form-element">
                            <Input type="text" v-model="formData.tel">
                            </Input>
                        </div>
                    </FormItem>
                </Col>
                <Col span="12">
                    <FormItem prop="card_no" label="身份证号:">
                        <div class="form-element">
                            <Input type="text" v-model="formData.card_no" disabled>
                            </Input>
                        </div>
                    </FormItem>
                </Col>
                <Col span="12">
                    <FormItem prop="area_type" label="区域类型:">
                        <Select v-model="formData.area_type">
                            <Option value="1">社区</Option>
                            <Option value="2">村</Option>
                        </Select>
                    </FormItem>
                </Col>
                <Col span="12">
                    <Form-item label="区域" prop="city">
                        <Select v-model="formData.area_id" @on-change="changeArea()">
                            <Option v-for="item in formData.areaList"
                                    :value="item.id"
                                    :key="item.id">{{ item.name }}
                            </Option>
                        </Select>
                    </Form-item>
                </Col>
                <Col span="12">
                    <Form-item label="街道" prop="city">
                        <Select v-model="formData.street_id" @on-change="changeStreet()">
                            <Option v-for="item in new_streetList"
                                    :value="item.id"
                                    :key="item.id">{{ item.name }}
                            </Option>
                        </Select>
                    </Form-item>
                </Col>
                <Col span="12" v-if="formData.area_type === '1'">
                    <Form-item label="社区" prop="city">
                        <Select v-model="formData.community_id">
                            <Option v-for="item in new_communityList"
                                    :value="item.id"
                                    :key="item.id">{{ item.name }}
                            </Option>
                        </Select>
                    </Form-item>
                </Col>
                <Col span="12" v-if="formData.area_type === '2'">
                    <Form-item label="社区" prop="city">
                        <Input type="text" v-model="formData.community"/>
                    </Form-item>
                </Col>
                <!--                <Col span="12">-->
                <!--                    <FormItem prop="community" label="来沈时间:">-->
                <!--                        <div class="form-element">-->
                <!--                            <Date-picker v-model="formData.arrive_time" type="date" placeholder="选择日期" style="width: 100%"></Date-picker>-->
                <!--                        </div>-->
                <!--                    </FormItem>-->
                <!--                </Col>-->
                <Col span="12">
                    <FormItem prop="loc_address" label="用户状态:">
                        <div class="form-element">
                            <Select v-model="formData.type" :disabled="typeIsUpdate">
                                <Option value="1">绿色通行码</Option>
                                <Option value="2">通行码已经失效（提报信息有误）</Option>
                                <Option value="3">黄色通行码（隔离）</Option>
                                <Option value="4">红色通行码（密接、确诊）</Option>
                                <Option value="8">等待审核</Option>
                                <Option value="9">外籍人员等待审核</Option>
                            </Select>
                        </div>
                    </FormItem>
                </Col>
                <!--                <Col span="12">-->
                <!--                    <FormItem prop="longitude" label="轨迹经度:">-->
                <!--                        <div class="form-element">-->
                <!--                            <Input type="text" v-model="formData.longitude"/>-->
                <!--                        </div>-->
                <!--                    </FormItem>-->
                <!--                </Col>-->
                <!--                <Col span="12">-->
                <!--                    <FormItem prop="latitude" label="轨迹纬度:">-->
                <!--                        <div class="form-element">-->
                <!--                            <Input type="text" v-model="formData.latitude">-->
                <!--                            </Input>-->
                <!--                        </div>-->
                <!--                    </FormItem>-->
                <!--                </Col>-->
                <Col span="24">
                    <FormItem prop="area_type" label="近14天您是否曾经在湖北省居住或到过湖北省？:">
                        <Select style=" width: 50%; padding-right: 8px;" v-model="formData.is_hubei">
                            <Option value="0">否</Option>
                            <Option value="1">是</Option>
                        </Select>
                    </FormItem>
                </Col>
                <Col span="24">
                    <FormItem prop="area_type" label="近14天您是否接触新冠肺炎确诊病例或疑似病例？:">
                        <Select style=" width: 50%; padding-right: 8px;" v-model="formData.is_contact" disabled>
                            <Option value="0">否</Option>
                            <Option value="1">是</Option>
                        </Select>
                    </FormItem>
                </Col>
                <Col span="24">
                    <FormItem prop="name" label="备注说明">
                        <div class="form-element">
                            <Input type="text" v-model="formData.remark"/>
                        </div>
                    </FormItem>
                </Col>
            </Row>
        </Form>
        <List header="其他数据信息" border size="small">
            <ListItem>p5={{ formData.p5 }}（异步刷新缓存）p3={{ formData.p3 }}
            </ListItem>
            <ListItem>openid={{ formData.openid }}</ListItem>
            <ListItem v-if="isCountryState">
                <span style="color: red;">(国家卫建委比对信息,不可以处理任何通行码信息)p2={{ formData.p2 }}</span>
            </ListItem>
            <!--            <ListItem>近14天您是否接触新冠肺炎确诊病例或疑似病例？：{{ formData.is_contact ==='1'?'是':'否' }}</ListItem>-->
            <!--            <ListItem>近14天您是否曾经在湖北省居住或到过湖北省？：{{ formData.is_hubei ==='1'?'是':'否' }}</ListItem>-->
        </List>
        <div class="otherInfo">
            <div v-for="(item,index) in other.redisList" :key="index">
                <div v-if="formData.openid==item.openid">
                    <Alert>
                        <span v-if="item.type==type">redis的状态和数据库状态一致</span>
                        <span v-else style="color: red">缓存状态不一致
                        <Button type="error" @click="synRedis('redis')">刷新缓存</Button>
                        </span>
                    </Alert>
                </div>
                <Alert>
                    <span v-if="formData.is_contact=='0'">近14天未接触新冠肺炎确诊病例或疑似病例</span>
                    <span v-else style="color: red">近14天已接触新冠肺炎确诊病例或疑似病例
                        <Button type="error" @click="synRedis('is_contact')">修改为未接触</Button>
                        </span>
                </Alert>
            </div>
        </div>
        <div slot="footer">
            <Button @click="showModel=false" :loading="loading">取消</Button>
            <Button type="success" @click="handleSubmit" :loading="loading" v-has="'customerUpdateUserBtn'">确认修改
            </Button>
        </div>
    </Modal>
</template>

<script>
import areaList from '../date/area.json'
import streetList from '../date/street.json'
import communityList from '../date/community.json'
import { updatePermitInfo } from '@/api/customer-service'

export default {
  name: 'customer-info',
  data () {
    return {
      loading: false,
      showModel: false,
      formData: {},
      areaList: areaList,
      streetList: streetList,
      communityList: communityList,
      new_streetList: [],
      new_communityList: [],
      type: ''
    }
  },
  props: {
    options: {
      type: Object,
      default: () => {
        return ''
      }
    },
    countChange: {
      type: Number
    },
    other: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  computed: {
    isCountryState () {
      // ---国家为建委数据
      if (!this.$common.xeUtils.isEmpty(this.formData.p2)) {
        if (this.formData.p2.indexOf('sfzhm') !== -1) {
          return true
        }
      }
      return false
    },
    typeIsUpdate () {
      return this.$store.state.user.severUserInfo.data.loginName !== 'admin'
    }
  },
  methods: {
    modelCancel () {
      this.showModel = false
    },
    synRedis (key) {
      let data = {
        id: this.formData.id,
        openid: this.formData.openid,
        card_no: this.formData.card_no
      }
      if (key === 'is_contact') {
        data.is_contact = '0'
      } else if (key === 'redis') {
        data.update_redis = 'yes'
      }
      this.updateUserInfoAction(data).then(ret => {
        if (ret !== false) {
          this.$Message.info(ret.errmsg)
        }
      })
    },
    getDate (str) {
      let oDate = new Date(str)
      let oYear = oDate.getFullYear()
      let oMonth = oDate.getMonth() + 1
      let oDay = oDate.getDate()
      let oTime = oYear + '-' + oMonth + '-' + oDay
      return oTime
    },
    handleSubmit () {
      // if (this.formData.arrive_time === '' || this.formData.arrive_time === undefined || this.formData.arrive_time === null) {
      //   this.$Message.error('请选择来沈时间')
      //   return false
      // }
      this.formData.code = 'permit_kf'
      this.formData.arrive_time = '1001-00-00 00:00:00'
      this.formData.create_time = this.getDate(this.formData.create_time)
      for (let i = 0; i < this.areaList.length; i++) {
        if (this.formData.area_id === this.areaList[i].id) {
          this.formData.area = this.areaList[i].name
        }
      }
      for (let i = 0; i < this.streetList.length; i++) {
        if (this.formData.street_id === this.streetList[i].id) {
          this.formData.street = this.streetList[i].name
          if (this.formData.area_type === '2') {
            console.log(this.formData.area_type + '~~~' + this.streetList[i].company_code)
            this.formData.company_code = this.streetList[i].company_code
          }
        }
      }
      for (let i = 0; i < this.communityList.length; i++) {
        if (this.formData.community_id === this.communityList[i].id) {
          this.formData.community = this.communityList[i].name
          if (this.formData.area_type === '1') {
            console.log(this.formData.area_type + '~~~' + this.communityList[i].company_code)
            this.formData.company_code = this.communityList[i].company_code
          }
        }
      }
      console.log(this.formData)
      let data = {
        id: this.formData.id,
        openid: this.formData.openid,
        name: this.formData.name,
        type: this.formData.type,
        card_no: this.formData.card_no,
        p5: 0,
        area_type: this.formData.area_type,
        area_id: this.formData.area_id,
        area: this.formData.area,
        street_id: this.formData.street_id,
        street: this.formData.street,
        community_id: this.formData.community_id,
        community: this.formData.community,
        tel: this.formData.tel,
        remark: this.formData.remark,
        is_hubei: this.formData.is_hubei
      }
      console.log(data)
      this.updateUserInfoAction(data).then(ret => {
        if (ret !== false) {
          this.$Message.info(ret.errmsg)
          this.modelCancel()
        }
      })
    },
    async updateUserInfoAction (data) {
      let result = await updatePermitInfo(data).then(ret => {
        if (ret.data.errcode === 200) {
          return ret.data
        } else {
          this.$Message.error(ret.data.errmsg)
          return false
        }
      })
      return result
    },
    changeArea () {
      console.log(this.formData.area_id)
      this.new_streetList = []
      this.new_communityList = []
      this.formData.community = ''
      let new_street_list = []
      for (let i = 0; i < this.streetList.length; i++) {
        if (parseFloat(this.streetList[i].pid) === parseFloat(this.formData.area_id)) {
          new_street_list.push(this.streetList[i])
        }
      }
      console.log(new_street_list, '组装街道')
      this.new_streetList = new_street_list
    },
    changeStreet () {
      console.log(this.formData.street_id)
      this.new_communityList = []
      this.new_community = ''
      let new_community_list = []
      for (let i = 0; i < this.communityList.length; i++) {
        if (parseFloat(this.communityList[i].pid) === parseFloat(this.formData.street_id)) {
          new_community_list.push(this.communityList[i])
        }
      }
      console.log(new_community_list, '组装')
      this.new_communityList = new_community_list
    }
  },
  watch: {
    countChange (data) {
      this.showModel = true
    },
    options (data) {
      this.formData = data
      this.type = this.$common.xeUtils.clone(data.type)
      this.changeArea()
      this.changeStreet()
    }
  },
  mounted () {
  }
}
</script>

<style scoped>
    .otherInfo {
        margin-top: 5px;
    }
</style>
